<template>
    <div>
        <Index/>
        <h3 id="title">第一次来到三亚</h3>
        <VlogIcons/>
        <div class="hrs"></div>
       <div class="descrption">
         <p class="content">竟然真的来到了三亚度假，三亚的天气很好非常的舒服，坐在海边，迎面吹着海风，感觉还不错。快到中午的时间了，吃点什么呢？靠近海边不吃海鲜真的有点错过了什么，哈哈，那下午就吃海鲜吧。</p>
           <van-image :lazy-load="true"  src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1608112405136&di=6e02cfd21de5562ebb8d8c6285767f2d&imgtype=0&src=http%3A%2F%2Fa0.att.hudong.com%2F52%2F62%2F31300542679117141195629117826.jpg">
                 <template v-slot:loading>
                    <van-loading type="loading" size="20" />
                </template>
          </van-image>  

        

       </div>
       <PublishMessage/>


       
    </div>
    
</template>

<script>
import Index from "../Index"
import VlogIcons from "../smallComponents/vlog-icons"
import PublishMessage from "../smallComponents/publishMessage"

export default {
    name:"vlogMessage",
    data(){
        return{
        text:{
            id:"",
            name:""
        },
       
    }},
    components:{
        Index,
        VlogIcons,
        PublishMessage
    },
    mounted(){
          this.getText()
        //   console.log(this.$route)
    },
    methods:{
          sendMessage(){
        //    console.log(this.$store.state.count)
           return this.$store.state.count
        },
        getText(){
         let des= this.sendMessage().filter(value=>{
              return value.id===Number(this.$route.params.id)
            })
            this.text=des[0]
        }
    }
   
}
</script>

<style>
    #title{
        margin-top: 10px;
        text-align: center;
        margin-bottom: 2rem;
    }
    .descrption{
        margin-top: 2rem;
    }
.descrption .content{
    letter-spacing: 2px;
    text-indent: 2em;
    line-height: 2em;
}
.descrption  .van-image{
        width: 100%;  
    }
.descrption .van-image .van-image__img{
   
    width: 85%;
    margin: 0 auto;
} 
.hrs{
  
    width: 100%;
    border-top: 1px dashed #666;
}

</style>